<html>
<head>
  <title>Behold the slider!</title>
  <link rel="stylesheet" type="text/css" href="slider.css" />
  <script type="text/javascript" src="slider.js" />
</head>
<body>
<h1>Behold the slider!</h1>

<img class="ww_slider" id="ww_slider1"
src="http://mars.chase3000.com/dot_clear.gif"
onmousedown="ww_slider_mousedown(event, 'ww_slider1')" /><img
src="17vertical.png" class="ww_slider_line" id="ww_slider1_line" />

<p>Isn't that great? The slider's value is <span
id="ww_slider_listener1">0.25</span></p>

<div id="message" onclick="document.getElementById('ww_slider_listener1').style.color = 'green';">No message</div>

<script language="JavaScript" type="text/javascript">
ww_xDict['ww_slider1'] = 200;
ww_widthDict['ww_slider1'] = 200;
ww_posDict['ww_slider1'] = 0.25;

//document.getElementById('ww_slider_listener1').style.color = 'green';

registerCallback("ww_slider1", function () {
   var span = document.getElementById('ww_slider_listener1');
   document.getElementById('ww_slider_listener1').style.color = 'green';
   span.innerText = ww_posDict['ww_slider1'];
});
</script>

</body>
</html>